<template>
	<div class="box">
		<!-- 预留状态栏高度 -->
		<!-- 页面加载时获取到不同机型对应的状态栏的高度 -->
		<view class="statusBar" :style="{height:statusHeight}"></view>
		<view class="tab" @click="back">
			我的信息
		</view>
		<view class="msg">
			<text @click="changeImg">头像</text>
			<view class="headImg">
				1111
			</view>
			<text @click="changeUname">用户名</text>
			<view class="uname">
				11111
			</view>
			<text @click="changePhone">绑定手机号</text>
			<view class="phoneNum">
				11111
			</view>
			<text @click="changeSex">性别</text>
			<view class="sex">
				1111
			</view>
		</view>
	</div>
</template>

<script>
	export default{
		data(){
			return{
				statusHeight:0,
			}
		},
		onLoad(){
			// 获取设备信息 状态栏高度
			var info = uni.getSystemInfoSync();
			// console.log(info);
			this.statusHeight=info.statusBarHeight+'px';
			// 请求用户信息
			uni.request({
				url:"http://124.221.202.161/user/current",
				method:"GET",
				// data:uni.getStorage('token'),
				// header:uni.getStorage('token'),
				
				header: {
				       token:uni.getStorageSync('token')
				    },
				// data:this.$store.state.userAccount,
				success(res) {
					console.log(res)		
					// console.log(res.data.message=='未登录');
					console.log(uni.getStorageSync('token'))
					
				}
			})
		},
		methods:{
			// 返回上一页
			back(){
				uni.switchTab({
					url: '/pages/my/my'
				})
			},
			// 修改用户信息
			changeImg(){
				
			},
			changeUname(){
				
			},
			changePhone(){
				
			},
			changeSex(){
				
			}
		},

	}
</script>

<style lang="scss">
	.box{
		.statusBar{
			width: 100%;
			background-color: #fff;
		}
		.tab{
			width: 100%;
			height: 100rpx;
			color: white;
			background-color:blue;
			text-align: center;
			line-height: 100rpx;
			pointer-events: none;
			&:before{
				content: "<";
				box-sizing: border-box;
				height: 100rpx;
				width: 100rpx;
				color: white;
				position: absolute;
				left: 0;
				pointer-events: auto;
			}
		}
		.msg{
			text{
				display: block;
				margin:30rpx 30rpx 30rpx 70rpx;
				pointer-events: none;
				&:first-child{
					margin-top:100rpx;
				}
				&:after{
					content: ">";
					box-sizing: border-box;
					height: 100rpx;
					width: 100rpx;
					color: black;
					position: absolute;
					right: 0;
					pointer-events: auto;
				}
			}
			.headImg{
				position: absolute;
				right:120rpx;
				top:240rpx;
			}
			.uname{
				position: absolute;
				right:120rpx;
				top:320rpx;
			}
			.phoneNum{
				position: absolute;
				right:120rpx;
				top:400rpx;
			}
			.sex{
				position: absolute;
				right:120rpx;
				top:480rpx;
			}
		}
	}
</style>